<template>
  <div class="model-log-container">
    <a-tabs v-model="activeKey" @change="handleTabChange">
      <a-tab-pane key="mySubmit" tab="我提交的" v-if="$hasPermission('applyApprovalByMe')">
        <my-submit />
      </a-tab-pane>
      <a-tab-pane key="myReview" tab="我审核的" v-if="$hasPermission('approvalToMe')">
        <my-review />
      </a-tab-pane>
    </a-tabs>
  </div>
</template>

<script>
import { defineComponent } from 'vue'
import { Tabs } from 'ant-design-vue'
import MySubmit from './components/mySubmit.vue'
import MyReview from './components/myReview.vue'

export default defineComponent({
  name: 'ModelLog',
  components: {
    [Tabs.name]: Tabs,
    [Tabs.TabPane.name]: Tabs.TabPane,
    MySubmit,
    MyReview,
  },
  data() {
    return {
      activeKey: 'mySubmit',
    }
  },
  methods: {
    handleTabChange(key) {
      // 根据选中的标签页加载对应的数据
      this.loadData(key)
    },
    loadData(type) {
      // 这里添加获取数据的逻辑
      switch (type) {
        case 'mySubmit':
          // 获取我提交的数据
          break
        case 'myReview':
          // 获取我审核的数据
          break
      }
    },
  },
  created() {
    // 根据路由参数设置当前tab，默认为我提交的
    const activeTab = this.$route.query.activeTab || 'mySubmit'
    this.activeKey = activeTab
    this.loadData(activeTab)
  },
})
</script>

<style lang="less" scoped>
.model-log-container {
  padding: 24px;
  background: #fff;
}
</style>
